<template>
  <div>
    <FormTable :formData="formData"
               :columnData="columnData"
               :editData="editData"
               :url="$api.prize_getlist"
               :new_url="this.$api.prize_insert"
               :detail_url="this.$api.prize_info"
               :edit_url="this.$api.prize_save"
               :is_default_edit="true"
               label-width="160px"
               :pageConfig="pageConfig"></FormTable>
  </div>
</template>

<script>
export default {
  data () {
    return {
      formData: [
        {
          name: 'lottery_title',
          label: '抽奖活动标题',
          value: '',
          type: 'input'
        },
        {
          name: "display",
          label: "是否显示",
          value: '',
          type: 'select',
          groups: [
            {
              label: '所有',
              value: ''
            },
            {
              label: '隐藏',
              value: '0'
            },
            {
              label: '显示',
              value: '1'
            },
          ]
        },
      ],
      columnData: [
        {
          prop: "prize_id",
          label: "id"
        },
        {
          prop: "prize_title",
          label: "奖品标题"
        },
        {
          prop: "lottery_title",
          label: "抽奖活动标题"
        },
        {
          prop: "prize_type",
          label: "奖品类型"
        },
        {
          prop: "probability",
          label: "中奖概率"
        },
        {
          prop: "remain_num",
          label: "中奖概率"
        },
        {
          prop: "prize_img",
          label: "奖品图片",
          custom: true,
          type: 'image',
        },
        {
          prop: "sort",
          label: "排序",
          custom: true,
          type: 'input',
          url: this.$api.prize_sort
        },
        {
          prop: "display",
          label: "是否显示",
          custom: true,
          type: 'switch',
          url: this.$api.prize_status
        },
        {
          prop: 'btn_group',
          label: '操作',
          custom: true,
          type: 'btn_group',
          width: '200px',
          group: [
            {
              name: '编辑',
              type: 'edit',
              color: 'primary',
              detail_mark: 'prize_id',
            },
            {
              name: '删除',
              type: 'delete',
              color: 'danger',
              url: this.$api.prize_status
            }
          ]
        }
      ],
      editData: [
        {
          name: 'prize_id',
          label: '奖品id',
          value: '',
          type: 'input',
          display: 'none'
        },
        {
          name: 'lottery_id',
          label: '抽奖活动',
          value: '',
          type: 'select',
          groups: [],
          sel_arr: ['ticket_type_id'],
          sel_rule: [
            {
              id: 3,
              show_arr: ['ticket_type_id']
            }
          ],
          rules: [
            { required: true, message: "请选择抽奖活动", trigger: "blur" },
          ]
        },
        {
          name: 'prize_type',
          label: '奖品类型',
          value: '0',
          type: 'select',
          groups: [
            {
              label: '谢谢参与',
              value: '0'
            },
            {
              label: '权益产品',
              value: '1'
            },
            {
              label: '自有会员卡',
              value: '2'
            },
            {
              label: '满减券折扣券',
              value: '3'
            },
            {
              label: '实物',
              value: '4'
            },
            {
              label: '积分',
              value: '5'
            },
          ],
          sel_arr: ['connect_id', 'rule', 'probability', 'limit_num', 'remain_num'],
          sel_rule: [
            {
              id: 0,
              show_arr: ['probability']
            },
            {
              id: 1,
              show_arr: ['connect_id', 'probability', 'limit_num', 'remain_num'],
              change_arr: [
                {
                  name: 'connect_id',
                  url: this.$api.card_getnopagelist,
                  labelKey: 'name',
                  valueKey: 'card_id'
                }
              ]
            },
            {
              id: 2,
              show_arr: ['connect_id', 'probability', 'limit_num', 'remain_num'],
              change_arr: [
                {
                  name: 'connect_id',
                  url: `${this.$api.card_getnopagelist}?type=1`,
                  labelKey: 'name',
                  valueKey: 'card_id'
                }
              ]
            },
            {
              id: 3,
              show_arr: ['connect_id', 'probability', 'limit_num', 'remain_num'],
              change_arr: [
                {
                  name: 'connect_id',
                  url: `${this.$api.coupon_getnopagelist}`,
                  labelKey: 'title',
                  valueKey: 'coupon_id'
                }
              ]
            },
            {
              id: 5,
              show_arr: ['probability', 'limit_num', 'rule','remain_num']
            },
          ],
          rules: [
            { required: true, message: "请选择奖品类型", trigger: "blur" },
          ]
        },
        {
          name: 'probability',
          label: '中奖概率（0-100）',
          value: '',
          datatype:'number',
          type: 'input',
          rules: [
            { required: true, message: "请输入中奖概率", trigger: "blur" },
            { type: 'number', message: '中奖概率必须为数字值'},
          ]
        },
        {
          name: 'limit_num',
          label: '奖品数量',
          value: '',
          datatype:'number',
          type: 'input',
          rules: [
            { required: true, message: "请输入奖品数量", trigger: "blur" },
            { type: 'number', message: '奖品数量必须为数字值'},
          ]
        },
        {
          name: 'connect_id',
          label: '奖品',
          value: '',
          type: 'select',
          groups: [],
        },
        {
          name: 'rule',
          label: '奖品积分',
          value: '',
          type: 'input',
        },
        {
          name: 'remain_num',
          label: '奖品剩余数量',
          value: '',
          type: 'text',
          is_sumbit: false,
        },
        {
          name: 'sort',
          label: '排序',
          value: '',
          type: 'input',
        },
        {
          name: "display",
          label: "是否显示",
          value: '',
          type: 'switch',
          config: {
            'active_value': '1',
            'inactive-value': '0'
          }
        },
        {
          name: 'prize_img',
          label: '奖品图片',
          value: '',
          type: 'image_upload',
          width: '100%',
          config: {
            accept: ".jpg,.png,.bmp,.gif,.svg",
            fileList: [],
            multiple:true,
            // is_icon:true
          },
          rules: [
            { required: true, message: "请添加奖品图片", trigger: "blur" },
          ]
        },
      ],
      pageConfig: {
        page: 1,
        pagesize: 10,
      }
    };
  },
  created () {
    this.getLottery();
  },
  methods: {
    getLottery () {
      this.$req.get(this.$api.lottery_getnopagelist).then(res => {
        let data = res.data;
        for (var i in data) {
          this.editData[1].groups.push({
            label: data[i].title,
            value: data[i].lottery_id
          })
        }
      })
    },
    handleSizeChange (e) {
      console.log(e);
    },
    handleCurrentChange (e) {
      console.log(e);
    },
    submit (e) {
      console.log(e);
    },
    reset (e) {
      console.log(e);
    }
  }
}
</script>

<style lang="scss" scoped>
</style>